<script setup lang="ts">
import Top from "../components/项目三/Top.vue";
import GoodsList from "../components/项目三/GoodsList.vue";

import { ref } from "vue";
const goodsList = ref<GoodsList[]>([
  { id: 1, name: "女装", link: "#women" },
  { id: 2, name: "男装", link: "#man" },
  { id: 3, name: "手机", link: "#phone" },
  { id: 4, name: "电脑", link: "#computer" },
  { id: 5, name: "运动", link: "#sport" },
]);

function updateMenu() {
  goodsList.value = [
    { id: 1, name: "热销商品", link: "#home" },
    { id: 2, name: "新品上市", link: "#new-arrivals" },
    { id: 3, name: "特价商品", link: "#sales" },
    { id: 4, name: "二手市场", link: "#toos" },
    { id: 4, name: "商品回收", link: "#toos" },
  ];
}

interface GoodsList{
id: number;
name: string;
link: string;
}
</script>

<template>
  <Top></Top>
  <GoodsList :goodsList="goodsList"></GoodsList>
  <button @click="updateMenu">更新菜单</button>
</template>

<style>
button {
  padding: 5px;
  margin: 30px 0 0 100px;
}
</style>
